<template>
    <div :style='styles' :class="formmain" ref="formmains">
        <el-card v-for="(card,index) in tabList" :key="index" shadow="always" :style='{"height":card.h,"width":card.w,"marginLeft":card.marginLeft}' :class='{"form_card":true,"form_card2":card.type=="form","form_card3":card.type!="form"}' >
            <div slot="header" class="clearfix" v-if="card.type!='funeral_title'">
                <span><i class='el-icon-warning' style='margin-right:5px;'></i>{{card.title}}</span>
                <el-button style="float: right; padding: 3px 0" type="text"></el-button>
            </div>
            <div  style='height:100%;' v-if="card.type=='form'||card.type=='editor'||card.type=='editorView'||card.type=='funeral_title'||card.type=='tableEditButton'||card.type=='funeral_item_table'||card.type=='funeral_item_table_cemetery'||card.type=='order_food'||card.type=='list'||card.type=='fuernalItemSelect'||card.type=='fuernalItemSelectfs'||card.type=='funeral_item_simple_table'||card.type=='warehouseItemSelect'||card.type=='funeral_item_table_type'||card.type=='warehouseItemSelectCemetery'||card.type=='gm_funeral_item_table'||card.type=='funeral_item_table_list'">
                <my-form ref="myForms" @openWinEdit="openWinEdit" :oldData="oldData" :list="card.list" :w="card.w" :selectData="selectData" :data="data" :rules='card.rules' v-if="card.type=='form'&&showForm" @input="changeInput" @funeralItemSelectEvent="funeralItemSelectEvent" :appid="appid"></my-form>
                <table-edit-button  @goSearch="goSeach2"  ref="tableEdits"  @openWinEdit="openWinEdit"    @remove="remove"  :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='tableEditButton'&&showForm" @input="changeInput" :appid="appid"></table-edit-button>
                
            <funeral-item-select ref="tableEdits2" @funeralItemSelectEvent="funeralItemSelectEvent"  :listField="card.list" :dataField="card.dataField" :data="data" :extype="card.extype" v-if="card.type=='fuernalItemSelect'&&showForm" @input="changeInput" :params="params" appid="bygex"></funeral-item-select>
            <funeral-item-select ref="tableEdits2" @funeralItemSelectEvent="funeralItemSelectEvent"  :listField="card.list" :dataField="card.dataField" :data="data" :extype="card.extype" v-if="card.type=='fuernalItemSelectfs'&&showForm" @input="changeInput" :params="params" appid="bygex" isfs="Y"></funeral-item-select>
                <warehouse-item-select ref="tableEdits2" @funeralItemSelectEvent="funeralItemSelectEvent"  :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='warehouseItemSelect'&&showForm" @input="changeInput" :params="params" appid="bygex" :extype="card.extype" :exkey="card.exkey" :expost="card.expost"></warehouse-item-select>
                <warehouse-item-select ref="tableEdits2" @funeralItemSelectEvent="funeralItemSelectEvent"  :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='warehouseItemSelectCemetery'&&showForm" @input="changeInput" :params="params" appid="cemetery" :exkey="card.exkey" :extype="card.extype"></warehouse-item-select>
                <funeral-item-table ref="tableEdits" :exkey="card.exkey" :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='funeral_item_table'&&showForm" @input="changeInput" :params="params" appid="bygex"  :extype="card.extype"></funeral-item-table>
                <funeral-item-table ref="tableEdits" :exkey="card.exkey"  :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='funeral_item_table_cemetery'&&showForm" @input="changeInput" :params="params" appid="cemetery"  :extype="card.extype" isgm="Y"></funeral-item-table>
                <funeral-item-table ref="tableEdits" :exkey="card.exkey"   :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='funeral_item_table_type'&&showForm" @input="changeInput" :extype="card.extype" :params="params" appid="bygex"></funeral-item-table>
               
                <funeral-item-table-list ref="tableEdits" :exkey="card.exkey" :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='funeral_item_table_list'&&showForm" @input="changeInput" :params="params" appid="bygex"  :extype="card.extype"></funeral-item-table-list>
                <funeral-item-simple-table ref="tableEdits" :exkey="card.exkey"  :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='funeral_item_simple_table'&&showForm" @input="changeInput" :params="params" appid="bygex"  :extype="card.extype" ></funeral-item-simple-table>
                <funeral-title :exkey="card.exkey"  :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='funeral_title'&&showForm" @input="changeInput" :params="params" appid="bygex"  :extype="card.extype" ></funeral-title>
                
                
                <batch-funeral-item-table ref="tableEdits" :exkey="card.exkey"   :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='gm_funeral_item_table'&&showForm" @input="changeInput" :params="params" appid="cemetery"  :extype="card.extype" isgm="Y"></batch-funeral-item-table>
                <order-food  :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='order_food'&&showForm" @input="changeInput" :params="params" :appid="appid"></order-food>
            <editor   :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='editor'&&showForm" @input="changeInput" :extype="card.extype"  :exkey="card.dataField" :params="params" ></editor>
            <editor-view   :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='editorView'&&showForm" @input="changeInput" :extype="card.extype"  :exkey="card.dataField" :params="params" ></editor-view>
            
                <commonList ref="commonList"  sKey="" @goSearch="goSearch"  @openWin="openWinEdit"  listnames='' :appid="appid"  :model_key="card.dataField.split('#')[0]"  @rowDbClick="rowDbClick" :model="card.dataField.split('#')[1]" :exId="sId" v-if="card.type=='list'&&showForm"></commonList>
            
            </div>
            <table-form ref="tableEdits" :exkey="card.exkey"  @goSearch="goSeach2"   :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='table_form'&&showForm" @input="changeInput" :appid="appid" :extype="card.extype"></table-form>
            <capture ref="tableEdits" :selectData="selectData" :exkey="card.exkey"  @openWin="openWinEdit"  @remove="remove" @openWinEdit="openWinEdit" :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='capture'&&showForm" @input="changeInput" :appid="appid"></capture>
           
            <table-edit ref="tableEdits" :selectData="selectData" :exkey="card.exkey"  @openWin="openWinEdit"  @remove="remove" @openWinEdit="openWinEdit" :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='table'&&showForm" @input="changeInput" :appid="appid"></table-edit>
            <table-edit ref="tableEdits" :selectData="selectData"   :exkey="card.exkey"   @remove="remove" @openWinEdit="openWinEdit" :listField="card.list" :dataField="card.dataField" isDel="N" :data="data" v-if="card.type=='tablenoDel'&&showForm" @input="changeInput" :appid="appid"></table-edit>
            <table-edit2 ref="tableEdits"  :selectData="selectData"  :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='table2'&&showForm" @input="changeInput" :appid="appid" :exkey="card.exkey"></table-edit2>
            <!--table-edit3 ref="tableEdits"  :listField="card.list" :dataField="card.dataField" :data="data" v-if="card.type=='table3'&&showForm" @input="changeInput" :appid="appid"></table-edit3-->
            <cemetery-tomb ref="tomb"  :listField="card.list" :dataField="card.dataField" :datas="data" v-if="card.type=='tomb'&&showForm" @input="changeInput" :appid="appid"></cemetery-tomb>
        
            <car-map  ref="carMap" :listField="card.list" :dataField="card.dataField" :data="data" :exkey="card.exkey" v-if="card.type=='carMap'&&showForm" @input="changeInput" :appid="appid"></car-map>
           
        </el-card> 
    </div>
</template>
<script>
//import CommonList  from '../list/commonList.vue'
//import MyForm  from '../edit/Form.vue'
//import tableEdit  from '../edit/tableEdit.vue'
//import tableEditButton  from '../edit/tableEditButton.vue'
//import tableEdit2  from '../edit/tableEdit2.vue'
//import tableEdit3  from '../edit/tableEdit3.vue'
//import TableForm  from '../edit/TableForm.vue'
//import FuneralItemTable  from '../byg/FuneralItemTable.vue'
//import FuneralItemTableType  from '../byg/FuneralItemTableType.vue'
//import FuneralItemSelect  from '../byg/FuneralItemSelect.vue'
//import WarehouseItemSelect  from '../byg/WarehouseItemSelect.vue'
//import BatchFuneralItemTable  from '../gm/BatchFuneralItemTable.vue'
//import OrderFood  from '../byg/OrderFood.vue'
//import CommonPrint  from '../../views/common/print/CommonPrint.vue'
//import CemeteryTomb  from '../../views/gm/CemeteryTomb.vue'
//import editor from './editor.vue'
//import editorView from './editorView.vue'


//import { defineAsyncComponent } from 'vue' // 需要引入defineAsyncComponent
//const MyForm = defineAsyncComponent(() => import('../edit/Form.vue'))
export default {
    props:["cards","appid","data","selectData","params","showForm","sId","isFlex","oldData","noflex"],
    components: {
       CarMap: resolve => {require(['../edit/CarMap.vue'], resolve)},
       MyForm: resolve => {require(['../edit/Form.vue'], resolve)},
       tableEdit: resolve => {require(['../edit/tableEdit.vue'], resolve)},
       tableEdit2: resolve => {require(['../edit/tableEdit2.vue'], resolve)},
       tableEditButton: resolve => {require(['../edit/tableEditButton.vue'], resolve)},
       TableForm: resolve => {require(['../edit/TableForm.vue'], resolve)},
       FuneralItemTableList: resolve => {require(['../byg/FuneralItemTableList.vue'], resolve)},
       FuneralItemTable: resolve => {require(['../byg/FuneralItemTable.vue'], resolve)},
       FuneralItemSimpleTable: resolve => {require(['../byg/FuneralItemSimpleTable.vue'], resolve)},
       FuneralItemTableType: resolve => {require(['../byg/FuneralItemTableType.vue'], resolve)},
       FuneralItemSelect: resolve => {require(['../byg/FuneralItemSelect.vue'], resolve)},
       WarehouseItemSelect: resolve => {require(['../byg/WarehouseItemSelect.vue'], resolve)},
       BatchFuneralItemTable: resolve => {require(['../gm/BatchFuneralItemTable.vue'], resolve)},
       OrderFood: resolve => {require(['../byg/OrderFood.vue'], resolve)},
       FuneralTitle: resolve => {require(['../byg/FuneralTitle.vue'], resolve)},
       CommonPrint: resolve => {require(['../../views/common/print/CommonPrint.vue'], resolve)},
       CemeteryTomb: resolve => {require(['../../views/gm/CemeteryTomb.vue'], resolve)},
       editor: resolve => {require(['./editor.vue'], resolve)},
       editorView: resolve => {require(['./editorView.vue'], resolve)},
       capture: resolve => {require(['./Capture.vue'], resolve)},
       CommonList: resolve => {require(['../list/commonList.vue'], resolve)},
       //MyForm,
       //tableEdit,
       //tableEditButton,
       //tableEdit2,
       //tableEdit3,
      // CemeteryTomb,
       //FuneralItemTable,
       //OrderFood,
       //TableForm,
      // CommonList,
      // CommonPrint,
       //BatchFuneralItemTable,
       //FuneralItemTableType,
       //FuneralItemSelect,
      // WarehouseItemSelect,
       //editor,
      // editorView
    },
    provide: function () {
        return {
        }
    },
    data(){
        return{
            widths:"100%",
            type:"",
            tabList:[],
            formmain:"formmain",
            styles:{
                
            }
        }
    },
    created(){
        
        
        if(this.isFlex=="Y")
           this.widths=this.cards.w;
        this.type=this.cards.type;
        //this.tabList.push(this.cards);
        this.tabList=[];
        let cards=JSON.parse(JSON.stringify(this.cards));
        cards.w="100%"
        let list=[];

        let isSet=false;
        if(this.cards.list.length>0){
            for(let i=0;i<this.cards.list.length;i++){
                if(this.cards.list[i].type=="card"){
                    try{
                        if(this.cards.list[i].exkey.flex){//classname
                            this.formmain=this.cards.list[i].exkey.flex;
                            isSet=true;
                        }
                    }catch(e){}
                    cards.list=JSON.parse(JSON.stringify(list));
                    let prew=this.cards.list[i].exkey.prew;  //上一个宽度
                    let w=this.cards.list[i].exkey.w;  
                    let title=this.cards.list[i].exkey.title;
                    cards.w=prew;
                    this.tabList.push(cards);
 
                    cards=JSON.parse(JSON.stringify(this.cards));
                    cards.title=title;
                    cards.w=w;
                    cards.marginLeft="3px"
                    list=[];

                }else{
                    list.push(this.cards.list[i]);
                }
            }
            if(list.length>0){
                cards.list=JSON.parse(JSON.stringify(list));
                this.tabList.push(cards);
            }
        }else{
            this.cards.w="100%"
            this.tabList.push(this.cards)
        }
        if(this.noflex=="noflex"&&!isSet){
            this.formmain="formmainnoflex"
        }
        try{
            if(cards.exkey.flexs){
                this.formmain=cards.exkey.flexs;
            }
        }catch(e){}
        
        this.styles["height"]=cards.h;
        this.styles["width"]=this.widths;
        try{
            if(cards.exkey.styles){
                let styles=cards.exkey.styles;
                for(let key in styles){
                    this.styles[key]=styles[key]
                }
            }
        }catch(e){}
    },
   
  
    methods:{
        saveCommonData(data){
            try{
                let forms=this.$refs.tableEdits;
                for(let i=0;i<forms.length;i++){
                    try{
                        forms[i].saveData(data)
                    }catch(e){console.log(e.message)}
                }
            }catch(e){console.log(e.message)}
            
            
           
        },
        initSaveData(){
            try{
                let forms=this.$refs.tableEdits;
                for(let i=0;i<forms.length;i++){
                    try{
                        forms[i].initSaveData()
                    }catch(e){console.log(e.message)}
                }
            }catch(e){console.log(e.message)}
             
             
        },
        initData(){
           let that=this;
            that.$nextTick(() => {
                try{
                    let forms=that.$refs.myForms;
                    for(let i=0;i<forms.length;i++){
                        try{
                            forms[i].initData();
                        }catch(e){}
                    }
                }catch(e){console.log(e.message)}
                try{
                    let formss=that.$refs.tableEdits;
                    for(let i=0;i<formss.length;i++){
                        try{
                            formss[i].initData();
                        
                        }catch(e){}
                    }
                }catch(e){console.log(e.message)}
                
                
            });
            
        },
        getValidateMsg(){
            let message="";
            try{
                let forms=this.$refs.myForms;
                for(let i=0;i<forms.length;i++){
                    try{
                    
                    ///for(let i=0;i<forms.length;i++){
                        let message_=forms[i].validate();
                        if(message_){
                            message=message_;
                            
                        }
                    
                // }
                    }catch(e){}
                }
            }catch(e){}
            try{
                let formss=this.$refs.tableEdits;
                for(let i=0;i<formss.length;i++){
                    try{
                    
                        let message_=formss[i].validate();
                        if(message_){
                            message=message_;
                            
                        }
                    }catch(e){}
                }
            }catch(e){}
            
            
            return message;
        },
        goSearchList(){
            try{
                let forms=this.$refs.myForms;
                for(let i=0;i<forms.length;i++){
                    try{
                        forms[i].goSearchList();
                    }catch(e){}
                }
            }catch(e){}
            
           
             try{
                 let el=this.$refs.tableEdits;
                 if(el.length){
                      for(let i=0;i<el.length;i++){
                        el[i].goSearchList();
                    }
                 }else{
                        
                    this.$refs.tableEdits.goSearchList();
                 }
                
            }catch(e){}
            
        },
        goSeach2(data){
            this.$emit("goSeach2",data);
        },
        goSeach(data){
           
            this.$emit("goSearch",data);
        },
        openWinEdit(data){
            this.$emit("openWinEdit",data);
        },
        remove(data){
            this.$emit("remove",data);
        },
        changeInput(data){
            this.$emit("changeInput",data);
        },
        rowDbClick(data){
            this.$emit("rowDbClick",data);
        },
        funeralItemSelectEvent(data){
            this.$emit("funeralItemSelectEvent",data);
            /*if(this.$refs.tableEdits)
                this.$refs.tableEdits[this.$refs.tableEdits.length-1].addItem(data);*/
            
    
        },
        addItem(data){
            if(this.$refs.tableEdits){
                try{
                    this.$refs.tableEdits[0].addItem(data);
                }catch(e){}
                try{
                    this.$refs.tableEdits.addItem(data);
                }catch(e){}
            }
                
        },
        addItem2(data){
            try{
            if(this.type=='funeral_item_table'||this.type=='funeral_item_table_cemetery'||this.type=='funeral_item_table_type'||this.type=='gm_funeral_item_table'){
                
                if(this.$refs.tableEdits)
                    this.$refs.tableEdits[0].addItem(data);
            }
            }catch(e){}
            
        },
        setCarMapPointer(lng,lat,address){
          
           try{
            this.$refs.carMap[0].setCarMapPointer(lng,lat,address)
           }catch(e){}
            
        },
        setCarMap(map,setData,url){
          
          //try{
           this.$refs.carMap[0].setCarMap(map,setData,url)
         // }catch(e){}
           
       }
    }
}
</script>
<style scoped>
    .formmain{
        display: flex;
        flex-direction: row;
        margin-top:5px;
        
    }
    .formmainr{
        display: flex;
        flex-direction: row;
        margin-top:5px;
        flex-wrap: wrap;
    }
    .formmainposition{
        display: inline-block;
        margin-top:5px;
        position:absolute;
        top:0;
        margin-left:5px;
    }
    .noflex{
        display:inline-block;
        margin-top:5px;
    }
    .formmainnoflex{
        display:inline-block;
        margin-top:5px;
    }
    .formmainh{
        display: flex;
        flex-direction: column;
        margin-top:5px;
    }
    .formmain>>>.el-card__header{
        color: rgb(102, 177, 255);
        text-align:left;
    }
    .formmainnoflex>>>.el-card__header{
        color: rgb(102, 177, 255);
        text-align:left;
    }
    .noflex>>>.el-card__header{
        color: rgb(102, 177, 255);
        text-align:left;
    }
    .formmainposition>>>.el-card__header{
        color: rgb(102, 177, 255);
        text-align:left;
    }
    .formmainh>>>.el-card__header{
        color: rgb(102, 177, 255);
        text-align:left;
    }
    .form_card2 >>>.el-card__body{
        padding-bottom:30px !important;
    }
    .form_card3 >>>.el-card__body{
        padding-bottom:0px !important;
    }
</style>